<template>
    <div class="store-info">
        <div class="body row">
            <div class="img">
                <img :src="require('@/assets/images/store_img.png')" alt="" />
            </div>
            <div class="info">
                <div class="name">{{ storeInfo.name }}</div>
                <div class="notice">{{ storeInfo.notice }}</div>
                <div class="promotions row">
                    <div
                        class="item"
                        v-for="(item, index) in storeInfo.promotions"
                        :key="index"
                    >
                        {{ item.text }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    props: {
        storeInfo: {
            type: Object,
            default() {
                return {
                    name: "古茗",
                    notice:
                        "公共：来咯来咯，车厘子系列重磅来袭！新鲜车厘子，凡尔赛尊享限定，冬季热销榜首，快来体验吧~如有服务不周，请千万别放过。我们一定为您的消费，负责到底！",
                    promotions: [{ text: "新人优惠立减5元" }]
                };
            }
        }
    },
    data() {
        return {};
    },

    methods: {}
};
</script>


<style lang="less" scoped>
.store-info {
    padding: 100px 30px 30px 30px;
    background: #2e2f3b;
    color: #fff;
    font-size: 26px;

    .body {
        .img {
            height: 140px;
            margin-right: 30px;
            img {
                width: auto;
                height: 100%;
            }
        }
        .info {
            flex: 1 1 auto;
            .name {
                font-size: 30px;
                margin-bottom: 10px;
            }
            .notice {
                height: 30px;
                line-height: 30px;
                overflow: hidden;
                margin-bottom: 20px;
            }
            .promotions {
                .item {
                    font-size: 24px;
                    border-radius: 5px;
                    padding: 3px 10px;
                    background: #fff;
                    color: #fb4e44;
                    font-weight: 600;
                    margin-right: 10px;
                }
            }
        }
    }
}
</style>